<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JSON</title>
</head>
<body>
    
</body>
<script>
    // 定义天气对象
    let weather = {
        city : "北京",
        date : "2088-08-08",
        wendu : "10°~23°",
        shidu : "22%"
    };

    let weathers = [
        {
            city : "北京",
            date : "2088-08-08",
            wendu : "10°~23°",
            shidu : "22%"
        },
        {
            city : "上海",
            date : "2028-08-08",
            wendu : "10°~23°",
            shidu : "21%"
        },
        {            
            city : "武汉",
            date : "2020-08-08",
            wendu : "18°~20°",
            shidu : "26%"
        }   
    ]

    // 1.将天气对象转为json格式的字符串
    let str = JSON.stringify(weather);
    document.write("str="+str+"<br>");

    document.write("<hr>")

    // 2. 将JSON格式字符串解析为js对象
    let weather2 = JSON.parse(str);
    document.write("城市："+weather2.city+"<br>");
    document.write("日期："+weather2.date+"<br>");
    document.write("温度："+weather2.wendu+"<br>");
    document.write("湿度："+weather2.shidu+"<br>");

    document.write("<hr>")

    // 3. 多个元素，使用数组表示
    document.write("城市："+weathers[1].city+"<br>");
    document.write("日期："+weathers[1].date+"<br>");
    document.write("温度："+weathers[1].wendu+"<br>");
    document.write("湿度："+weathers[1].shidu+"<br>");

    document.write("<hr>")

    document.write("城市："+weathers[2].city+"<br>");
    document.write("日期："+weathers[2].date+"<br>");
    document.write("温度："+weathers[2].wendu+"<br>");
    document.write("湿度："+weathers[2].shidu+"<br>");

</script>
</html>